/**根据不同的类型，将渲染schema的工作交给对应的组件来做
 *
 */
import { defineComponent, PropType } from 'vue'

import { Schema, SchemaTypes } from './types'
import StringField from './fileds/StringField'
import NumberField from './fileds/NumberField'

export default defineComponent({
  name: 'SchemaItem',
  props: {
    schema: {
      type: Object as PropType<Schema>,
      required: true,
    },
    value: {
      required: true,
    },
    onChange: {
      type: Function as PropType<(v: any) => void>,
      required: true,
    },
  },
  setup(props) {
    return () => {
      const { schema } = props
      //TODO:如果type没有指定，我们需要猜测这个type
      const type = schema.type

      let Component: any

      switch (type) {
        case SchemaTypes.STRING:
          Component = StringField
          break
        case SchemaTypes.NUMBER:
          Component = NumberField
          break
        default:
          console.warn(`${type} 不支持`)
      }
      return <Component {...props} />
    }
  },
})
